<template>
  <div>
    <HeaderIndex title="每日热映口碑榜" />
    <div class="static">
      <h3>每日热映口碑榜</h3>
      <p>2021-09-04已更新</p>
      <p>《每日热映口碑榜》——将昨日国内热映的影片，按照评分从高到低排列，取前10名，每天上午10点更新，相关数据来源于“猫眼专业版”及“猫眼电影库”</p>
    </div>
    <DayHotMovie v-for="v in dayHotMovieArr" :key="v.id" :data="v" />
    <footer>
      <p>
        <i class="iconfont icon-icon-class-c"></i>
        猫眼电影客服电话:
        <a href="javascript:void(0)">1010-5335</a>
      </p>
      <p>
        京ICP备16022489号-1 京公网安备11010502030881号
      </p>
      <p>北京猫眼文化传媒有限公司</p>
    </footer>
  </div>
</template>

<script>
import getLink from '@/api/getLink.js';
import DayHotMovie from '@/components/whs/dayHotMovie.vue';
export default {
  components: {
    DayHotMovie,
  },
  data() {
    return {
      dayHotMovieArr: [],
    };
  },
  created() {
    getLink('/api/board/mrrbdy').then(ok => (this.dayHotMovieArr = ok.data));
  },
};
</script>

<style lang="less" scoped>
.static {
  box-sizing: border-box;
  padding: 0.2rem;
  h3 {
    font-weight: 900;
    margin: 0.1rem 0;
    font-size: 0.35rem;
  }
  p {
    font-size: 0.27rem;
    margin: 0.1rem 0;
    &:first-of-type {
      color: orange;
    }
    &:last-of-type {
      color: #aaa;
    }
  }
  border-bottom: 1px solid #eee;
}
footer {
  text-align: center;
  i {
    vertical-align: middle;
  }
  a {
    text-decoration: underline;
    color: red;
  }
  p {
    color: #999;
    margin: 0.5rem 0rem;
    &:first-of-type {
      font-size: 0.3rem;
      color: black;
    }
  }
}
</style>
